<template>
	<view class="index">
		<navbar></navbar>
		<!-- <view class="index-title">
			<image class="header-Icon"  src="../../static/images/orderTitle.png" mode="widthFix"></image>
		</view> -->
		<view class="title"></view>
		<view v-if="!goods.loading || 0 < goods.list.length" class="container">
		    <!-- 藏品列表 -->
			<view class="assets-list">
				<view v-for="item in goods.list" :key="item.id" class="assets" >
					<view class="assets__img-wrapper">
						
						<img style='border-radius: 20rpx;' :src="item.logo" class="assets__img" mode=""></img>
<view class="ZZ" @tap.stop.prevent="onAssetsTaped(item.id)"></view>
						<!-- <easy-loadimage class="assets__img" mode="aspectFill" :scroll-top="scrollTop" :image-src="item.logo"></easy-loadimage> -->
					</view>
				</view>
			</view>
			<view v-show="goods.list.length>3 && !goods.hasMore" class="no-more f-24">
				-更多内容敬请期待-
				<view class="bsn">
					<image src="https://p6-tt.byteimg.com/origin/pgc-image/9ed074ff2e144aaca61866b159dee4bd" mode="widthFix"></image>
				</view>
			</view>
		</view>
		<view v-if="!goods.loading && goods.list.length == 0">
			<view class="yoshop-notcont">
				<!-- <text class="dy-iconfont icon-empty"></text> -->
				<text class="iconfont icon-wushuju"></text>
				<text class="cont">暂无数据</text>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	import navbar from "@/components/navbar/navbar";
	export default {
		components: {
			navbar
		},
		data() {
			return {
				// 页面参数
				options: {},
				// 页面元素
				loading: true,
				scrollTop: 0,
				info: {},
				goods: {
					list: [],
					page: 1,
					loading: true,
					hasMore: false,
				}
			};
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			// 当前页面参数
			this.getArtsData();
		},
		onReady: function() {
			
		},
		onShow: function() {
			
		},
		
		/**
		 * 下拉刷新
		 */
		onPullDownRefresh: function() {
			
			this.requestData()
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		
		methods: {
			getArtsData(){
				app._get('publisher/getList', {limit:999}, (res) => {
						if (1 == res.code) {
							console.log(res.data.data,'res.data.data请求成功返回数据')
							this.goods.list=res.data.data
						}
					},
					null,
					() => {
						// resolve();
						// this.goods.loading = false;
					}
				);
			},
			onAssetsTaped(id){
				app.navigationTo(`pages/art/index?id=${id}`)
			}
			
		}
	};
</script>
<style lang="scss">
	page,
	body {
		background: $uni-bg-color!important;
	}
</style>
<style lang="scss" scoped>
	.index{
		min-height: 100vh;
		overflow: hidden;
	}
	
	.title {
		margin-top: 100rpx;
		width: 100%;
		height: 30rpx;
		background: url(@/static/images/orderTitle.png);
		background-size: 100% 100%;
	}
	.container {
		padding: 0 40rpx 40rpx;
		padding-top: 40rpx;
		margin-top: 20rpx;
        // background: #242424;
		min-height: calc(100vh - 190rpx);
	}

	.diy-component {
		display: block;
		background: $uni-bg-color;
		padding-top: 40rpx;
	}
	.bsn{
		display: flex;
		justify-content: center;
		margin-top: 20rpx;
	}
	.bsn image{
		width: 200rpx;
	}
	.assets-list {
	    overflow: hidden;
	}
	.assets {
		width: 100%;
		margin-bottom: 20rpx;
		overflow: hidden;
	    box-sizing: border-box;
		position: relative;
		padding: 10rpx;
		// box-shadow: 10rpx 10rpx 10rpx rgba(255,255,255,0.4);
	}
	
	// .assets:nth-child(even) {
	//     margin-left: 20rpx;
	// }
	
	// .assets:nth-child(n+3) {
	//     margin-top: 20rpx;
	// }
	
	.assets .assets__img-wrapper {
	    // padding-bottom: 100%;
		height: 390rpx;
	    position: relative;
	    // border-radius: 10rpx 10rpx 0 0;
	}
	.ZZ{
		width: 100%;
		height: 100%;
		// background-color: #999;
		position: absolute;
		top: 0;
		left: 0;
	}
	
	.assets .assets__img {
		
	    width: 100%;
		height: 100%;
	    position: absolute;
	    left: 0;
	    top: 0;
	}
	.assets .assets-info {
		width: 100%;
		// height: 200rpx;
		padding: 20rpx 10rpx 10rpx;
	    // border-radius: 0 0 10rpx 10rpx;
		box-sizing: border-box;
		position: absolute;
		bottom: 0;
		color: #fff;
		background: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
	}
	
	.assets .assets__no-title {
	    background: $uni-bg-color;
	    padding: 0 10rpx;
	    line-height: 40rpx;
	}
	
	// .assets .assets__no-wrapper {
	//     background: rgba(0, 0, 0, 0.2);
	//     padding: 0 10rpx;
	//     line-height: 40rpx;
	// }
	
	// .assets .assets__price {
	//     color: #000;
	//     font-weight: bold;
	//     font-size: 32rpx;
	// }
	// .assets .icon-qianjin {
	//     color: #000;
	//     font-size: 36rpx;
	// }
</style>
